@page
@{ Layout = "_Layout"; }

<el-card class="box-card" :style="{ height: ($(window).height()-25) + 'px' }">
    <el-form ref="form" :model="form" :size="euiSize" label-width="180px">
        <el-form-item label="IP地址" prop="ipAddress" name="ipAddress" :rules="{ required: true, message: '请输入IP地址' }">
            <el-input v-model="form.ipAddress"></el-input>
        </el-form-item>
        <el-form-item v-if="submitted" label="所在区域">
            {{ getArea() }}
        </el-form-item>
        <el-form-item v-if="submitted && isAllowed" label="访问状态">
            <el-tag type="success" effect="dark">允许访问</el-tag>
        </el-form-item>
        <el-form-item v-if="submitted && !isAllowed" label="访问状态">
            <el-tag type="danger" effect="dark">禁止访问</el-tag>
        </el-form-item>
    </el-form>

    <div style="text-align: center;">
        <el-divider></el-divider>
        <div style="height: 10px"></div>

        <el-button :size="euiSize" icon="el-icon-search" type="primary" v-on:click="btnSubmitClick">
            查 询
        </el-button>
    </div>
</el-card>


@section Scripts{
<script src="/sitefiles/assets/js/block/js/query.js" type="text/javascript"></script>
}